<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link href="HTML/css/login.css" rel="stylesheet">
</head>

<body>
<div id="loginDiv">
    <form action="" id="form">
        <h1 id="loginMsg">LOGIN IN</h1>
        <div id="user" style="text-align: center;color: red;display: none">用户名或密码错误</div>
        <p>Username:<input id="username" name="username" type="text"></p>
        <p>Password:<input id="password" name="password" type="password"></p>

        <div id="subDiv">
            <input id="button" type="button" class="button" value="login up">
            <input type="reset" class="button" value="reset">&nbsp;&nbsp;&nbsp;
            <a href="register.html">没有账号？点击注册</a>
        </div>
    </form>
</div>

<script src="js/axios-0.18.0.js"></script>
<script src="js/vue.js"></script>
<script>

        document.getElementById("button").onclick = function () {


            axios({
                method: 'post',
                url: 'http://localhost:8080/brand-case/user/login?username=' + document.getElementById("username").value + '&password=' + document.getElementById("password").value,

            }).then(function (response) {

                if (response.data == "success") {
                    location.href = "brand.html";
                } else {

                    document.getElementById("user").style.display = '';

                }


            })
        }

</script>
</body>
</html>